<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>动态网页</title>
    <style>
        body {
            margin: 0;
            padding: 0;
        }
        ul{
            list-style: none;
            margin:0;
            padding: 0;
        }
        .clearfix:after{
            content: '';
            display: block;
            clear: both;
        }

        .container {
            width: 1200px;
            margin: 0 auto;
           
        }

        header {
            height: 60px;
            background-color: #2c3e50;
        }

        .head-nav {
            height: 100%;
        }
        .menu>.item{
            float: left;
            position: relative;
            
        }
        .menu>.item a{
            text-decoration: none;
            color: wheat;
            display: block;
            height: 60px;
            width: 100px;
            text-align: center;
            background-color: #34495e;
            line-height: 60px;
        }
        .menu .item::before{
            content: '';
            display: block;
            height: 60px;
            width: 2px;
            background-color: rgb(150, 214, 169);
            position: absolute;
        }
        .menu>.item:hover .submenu{
            display: block;
        }
        .submenu{
            position: absolute;
            left: 0;
            top:60px;
            display: none;
        }
    </style>
</head>

<body>
    <header>
        <nav class="head-nav container">
            <ul class="menu clearfix">
               
               
            </ul>
        </nav>
    </header>
    <p>网站采集了扁平化设计中最受欢迎的色彩，绝对是您进行扁平设计的必备工具，可以吸取复制任何你看中的色彩。配色经验：在扁平设计中，三原色是很少见的，即正红、正蓝和正黄。如果你想快速的配色，应选择相似的色调和饱和度。
            这个网站最重要的一点就是，你可以免费选择和下载色值到本地。</p>
    <script src="./二级菜单.js"></script>
</body>

</html>